﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AllHistory.aspx.cs" Inherits="CRMWeb.Pages.AllHistory" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>All History</title>
    <link rel="stylesheet" type="text/css" href="/EasyUI/Themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="/EasyUI/Themes/icon.css" />
    <link rel="stylesheet" type="text/css" href="/Css/CrmStyle.css" />
    <script type="text/javascript" src="/Scripts/jquery-1.8.0.min.js"></script>
    <script type="text/javascript" src="/EasyUI/jquery.easyui.min.js"></script>

</head>
<body>
    <form id="form1" runat="server">
        <div>
            <table cellspacing="0" class="history_table" cellpadding="0" border="0" style="width: 100%;">
                <tr>
                    <td colspan="2">
                        <div class="fitem">
                            <label>Search by action : </label>
                            <select id="cmbaction" class="easyui-combobox" data-options="panelHeight:'auto'" name="Action" style="width: 200px;">
                                <option value="Except System">Except System</option>
                                <option value="Call Received">Call Received</option>
                                <option value="Call Out">Call Out</option>
                                <option value="Email Received">Email Received</option>
                                <option value="Email Sent">Email Sent</option>
                                <option value="Fax Received">Fax Received</option>
                                <option value="Fax Sent">Fax Sent</option>
                                <option value="Post Received">Post Received</option>
                                <option value="Post Sent">Post Sent</option>
                                <option value="SMS Received">SMS Received</option>
                                <option value="SMS Sent">SMS Sent</option>
                                <option value="Email and SMS Sent">Email and SMS Sent</option>
                                <option value="Live Chat">Live Chat</option>
                                <option value="Came to our office">Came to our office</option>
                                <option value="Field Changed(System)">Field Changed(System)</option>
                                <option value="Email Received – Doc attached">Email Received – Doc attached</option>
                                <option value="ALL">ALL</option>

                            </select>
                            <%--  <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-search" onclick="quickSearch()"></a>--%>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width: 50%; vertical-align: top">
                        <table id="dgHistory" style="width: 1312px; height: auto;" fitcolumns="true" singleselect="true" autorowheight="true">
                            <thead>
                                <tr>
                                    <th field="HistoryID" style="width: 10%" hidden="true">HistoryID</th>
                                    <th field="HistoryDate" data-options="formatter:formatHistoryDate" style="width: 20%">Date</th>
                                    <th field="HistoryTime" data-options="formatter:formatHistoryTime" style="width: 20%">Time</th>
                                    <th field="Action" style="width: 40%">Action</th>
                                    <th field="Operator" style="width: 10%">Operator</th>
                                    <th field="Description" data-options="formatter:formatDescription" width="400px">Description</th>
                                </tr>
                            </thead>
                        </table>
                    </td>

                </tr>
                <tr>
                    <td style="text-align: right;">
                        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="javascript:$('body,html').scrollTop('0')">Back to top</a>
                    </td>
                    <td></td>
                </tr>
            </table>
        </div>

        <script type="text/javascript">
            $(document).ready(function () {
                $('#cmbaction').combobox('textbox').bind('click', function () {
                    $('#cmbaction').combobox('showPanel');
                });
                $('#dgHistory').datagrid({
                    url: '/WebServices/History.ashx?method=ApplicationHistorySelectAllByAction&app_id=' + getQuerystring('app_id', '') + '&Action=Except System',
                    // url: '/WebServices/History.ashx?method=SelectAllHistoryByType&historyType=Application&ID=' + getQuerystring('app_id', ''),
                    onSelect: function (rowIndex, rowData) {
                        document.onkeydown = function chekKey(e) {
                            e = e || window.event;
                            if (e.keyCode == '38') // up arrow
                            {
                                if (rowIndex == 0)
                                    $('#dgHistory').datagrid('selectRow', 4);
                                else
                                    $('#dgHistory').datagrid('selectRow', rowIndex - 1);
                            }
                            else if (e.keyCode == '40') // down arrow
                            {
                                if (rowIndex == 29)
                                    $('#dgHistory').datagrid('selectRow', 0);
                                else
                                    $('#dgHistory').datagrid('selectRow', rowIndex + 1);
                            }
                        }
                    },
                    rowStyler: function (index, row) {
                        if (index % 2 != 0) {
                            return 'background-color:#6293BB;color:#fff;font-weight:bold;';
                        }
                    },

                });
            });






            function formatHistoryDate(value, row) {
                if (value == null)
                    return '';
                var date = new Date(value);
                var y = date.getFullYear();
                var m = date.getMonth() + 1;
                var month = '';
                switch (m) {
                    case 1:
                        month = 'Jan';
                        break;
                    case 2:
                        month = 'Feb';
                        break;
                    case 3:
                        month = 'Mar';
                        break;
                    case 4:
                        month = 'Apr';
                        break;
                    case 5:
                        month = 'May';
                        break;
                    case 6:
                        month = 'Jun';
                        break;
                    case 7:
                        month = 'Jul';
                        break;
                    case 8:
                        month = 'Aug';
                        break;
                    case 9:
                        month = 'Sep';
                        break;
                    case 10:
                        month = 'Oct';
                        break;
                    case 11:
                        month = 'Nov';
                        break;
                    case 12:
                        month = 'Dec';
                        break;
                }
                var d = date.getDate();
                return (d < 10 ? ('0' + d) : d) + ' ' + month + ' ' + y;
            }

            function formatHistoryTime(value, row) {
                var hourEnd = value.indexOf(':');
                var H = +value.substr(0, hourEnd);
                var minutes = value.substring(3, 5);
                var ampm = '';
                if (H == 00) {
                    value = '00:' + minutes + 'AM';
                }
                else if (H == 12) {
                    value = '12:' + minutes + 'PM';
                }
                else {
                    var h = H % 12 || 12;
                    ampm = H < 12 ? 'AM' : 'PM';
                    value = h + value.substr(hourEnd, 3) + ampm;
                }
                return value;
            }


            //Format html content:
            function formatDescription(value, row) {
                return decodeURIComponent(value);
            }

            //get querystring value
            function getQuerystring(key, defaultValue) {
                if (defaultValue == null) defaultValue = '';
                key = key.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
                var regex = new RegExp("[\\?&]" + key + "=([^&#]*)");
                var qs = regex.exec(window.location.href);
                if (qs == null)
                    return defaultValue;
                else {
                    return qs[1];
                }
            }

            function quickSearch() {
                var cmbaction = $('#cmbaction').combobox('getValue');

                if (cmbaction == '')
                    $('#dgHistory').datagrid({
                        url: '/WebServices/History.ashx?method=ApplicationHistorySelectAllByAction&app_id=' + getQuerystring('app_id', '') + '&Action=' + cmbaction
                        //url: '/WebServices/History.ashx?method=SelectAllHistoryByType&historyType=Application&ID=' + getQuerystring('app_id', '')
                    });
                else
                    $('#dgHistory').datagrid({
                        url: '/WebServices/History.ashx?method=ApplicationHistorySelectAllByAction&app_id=' + getQuerystring('app_id', '') + '&Action=' + cmbaction
                    });
            }

            //onSelect quicksearch function:
            $('#cmbaction').combobox({
                onSelect: function (n, o) {
                    quickSearch();
                }
            });




        </script>
    </form>
</body>
</html>
